<template>
	<view>
		<view class="all">
			<view class="money">
				<view class="left">
					退款金额
				</view>
				<view class="right">
					  <u--input
					  type="number"
					    placeholder="请输入退款金额"
					    border="none"
					    clearable
						v-model="money"
						inputAlign="right"
					  ></u--input>
				</view>
			</view>
			<view class="btn" @click="makeSure()">
				<view :class="money===''? 'btns1':'btns2'">
					确 定
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {agreeRefund} from '@/utils/api.js'
	export default {
		data() {
			return {
				money:'',
				orderId:''
			};
		},
		onLoad(option) {
			console.log(option,'option');
			this.orderId=option.orderId
		},
		methods:{
			makeSure(){
				if(this.money){
					let data={refundId:this.orderId,amount:this.money}
					agreeRefund(data).then(res=>{
						console.log(res,'kkkkk');
						if(res.data.meta.status==200){
							uni.showToast({
								title:'已完成退房，款项已退回客户账户',
								icon:'none'
							})
							setTimeout(()=>{
								uni.switchTab({
									url:'/pages/order/order'
								})
							},1000)
						}
						else{
							uni.showToast({
								title:res.data.meta.msg,
								icon:'none'
							})
						}
					})
				}
				else{
					
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
.all{
	.money{
		background-color: #ffffff;
		height: 100rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 24rpx;
		margin-top: 8rpx;
	}
	.btn{
		height: 400rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		.btns1{
			background-color:#A8A8A8 ;
			width: 462rpx;
			height: 88rpx;
			border-radius: 44rpx;
			font-size: 32rpx;
			font-weight: bold;
			color: #FFFFFF;
			line-height: 88rpx;
			text-align: center;
		}
		.btns2{
			background-color:#5398F6 ;
			width: 462rpx;
			height: 88rpx;
			border-radius: 44rpx;
			font-size: 32rpx;
			font-weight: bold;
			color: #FFFFFF;
			line-height: 88rpx;
			text-align: center;
		}
	}
}
</style>
